// 一、window对象：每一个浏览器窗口就是一个window对象
// window对象是BOM的核心对象（顶层对象、全局对象）
// 注意：在对象中，值不是函数叫属性，值是函数叫方法
// 全局变量是window对象的属性：只有使用var声明的全局变量
// 全局函数是window对象的方法：字面量声明的函数或者var声明的变量赋值为函数

// // let a=10;//全局变量
// var abc=20;//全局变量
// // console.log(window);

// // 字面量声明的全局函数
// function asd(){
//     console.log("hello");
// }
// // var声明的变量赋值为函数
// var azx=function(){
//     console.log("123");
// }

// console.log(window)

// console.log(abc);
// console.log(window.abc);

// asd();
// window.asd();

// delete window.alert;
// delete window.abc;//删不掉，因为abc是使用var声明的基本数据类型
// console.log(window)


// 二、window对象的常用属性
// 1.可视窗口的大小（常用属性）
// console.log(innerWidth);//可视窗口的宽度
// console.log(innerHeight);//可视窗口的高度

// 2.浏览器窗口大小
// console.log(outerWidth);//浏览器窗口宽度
// console.log(outerHeight);//浏览器窗口高度

// 3.浏览器窗口的位置
// console.log(screenLeft);//282
// console.log(screenTop);//68
// console.log(screenX);//282
// console.log(screenY);//68

// 4.元素位置：根据元素的定位体系不同，位置参照不同
// 使用position: absolute;的元素参照上级元素中有定位的元素进行位置计算
// 其他元素参照可视窗口的位置进行计算
// offsetLeft:左边的距离
// offsetTop:上边的距离
let father=document.getElementsByClassName("father")[0];
let son=document.getElementsByClassName("son")[0];

// console.log(father.offsetLeft);
// console.log(father.offsetTop);

// console.log(son.offsetLeft);
// console.log(son.offsetTop);

// 5.元素大小
// console.log(father.offsetWidth);
// console.log(father.offsetHeight);
// console.log(son.offsetWidth);
// console.log(son.offsetHeight);


// 6.滚动条位置
// pageXOffset(scrollX):可视窗口水平方向滚动条位置(只读)
// pageYOffset(scrollY)：可视窗口垂直方向滚动条位置(只读)

// 元素节点.scrollLeft：元素节点的滚动条水平方向位置(只读)
// 元素节点.scrollTop：元素节点的滚动条垂直方向位置(只读)

// 设置滚动条到指定位置
// 元素节点.scrollTo(水平滚动条的位置,垂直滚动条的位置)

// let a=document.getElementsByTagName("a")[0];
// 监听滚动条事件：滚动条滚动就会触发该事件
// window.onscroll=function(){
//     // console.log(pageYOffset);
//     console.log(scrollY);
//     if(scrollY>=400){
//         a.style.display="block";
//     }else{
//         a.style.display="none";

//     }

// }

// father.onscroll=function(){
//     console.log(123);
//     console.log(father.scrollTop);
// }


// let btn=document.getElementsByTagName("button")[0];
// btn.onclick=function(){
//     console.log("123");
//     father.scrollTo(0,500);
// }

// 三、window对象的常用方法
// 1.系统提示框：alert(),提醒用户相关信息
// 返回值是undefined
// 只能传入一个参数
// 代码执行到alert，会暂停执行，直到用户点击确定
// let a=alert("请输入留言！","hello");
// console.log(a);//undefined


// 2.提示确认框：confirm(),提示用户选择
// 返回值是true或者false
// 只能传入一个参数
// 代码执行到confirm，会暂停执行，直到用户点击确定或者取消
// let b=confirm("确认要删除要学生？","123");
// console.log(b);//true


// 3.输入框:prompt(),提示用户输入内容
// 点击确定返回值是用户输入的内容；点击取消返回值是null
// 第一个参数表示提示信息；第二个参数表示默认值
// 代码执行到prompt，会暂停执行，直到用户点击确定或者取消
// let c=prompt("请输入数字:",6);
// console.log(c);

// 四、定时函数
// 1.间歇调用
// let stop=setInterval(回调函数,毫秒)：间隔指定毫秒数不断地执行回调函数
// stop:接受间歇调用的返回值,返回值是数字，表示当前的间歇调用函数是页面中的第几个间歇调用函数
// clearInterval(stop):停止间歇调用
// let i=1;
// let stop=setInterval(function(){
//     console.log(i++);
//     if(i==10){
//         clearInterval(stop);
//     }

// },1000);

// let stop2=setInterval(function(){
//     console.log(123);
// },2000);
// console.log("stop:",stop)
// console.log("stop2:",stop2)

// 2.超时调用
// let stop=setTimeout(回调函数,毫秒)：间隔指定的毫秒数之后执行一次回调函数
// stop:接受超时调用的返回值,返回值是数字，表示当前的超时调用函数是页面中的第几个超时调用函数
// clearTimeout(stop):停止超时调用

// let stop3=setTimeout(function(){
//     console.log(123);
// },5000);
// console.log("stop3:",stop)

// let x=1;
// let stop;
// function test(){
//     console.log(x++);
//     stop=setTimeout(test,1000);
//     console.log("stop:",stop);
//     if(x==10){
//         clearTimeout(stop);
//     }

// }
// test();